<template>
  <BasicModal
    title="请求详情"
    defaultFullscreen
    @register="register"
    @ok="closeModal"
  >
    <Description :column="3" :data="data" :schema="schema" />
    <MonacoEditor v-model:value="messageData" />
  </BasicModal>
</template>
<script lang="ts" setup>
import { ref, reactive, computed } from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { DescItem } from '@/components/Description/src/typing';
import { Description } from '@/components/Description';
import MonacoEditor from '@/components/Monaco/src/index.vue';
let data = reactive({});
let message = ref('');
const schema = ref<DescItem[]>([
  {
    label: '操作类型',
    field: 'opType',
  },
  {
    label: '是否执行成功',
    field: 'success',
  },

  {
    label: 'ip',
    field: 'ip',
  },
  {
    label: '地址',
    field: 'location',
  },
  {
    label: '浏览器',
    field: 'browser',
  },
  {
    label: '操作系统',
    field: 'os',
  },
  {
    label: '请求地址',
    field: 'url',
  },
  {
    label: '类名称',
    field: 'className',
  },
  {
    label: '请求方式',
    field: 'reqMethod',
  },
  {
    label: '返回结果',
    field: 'result',
  },
  {
    label: '操作时间',
    field: 'opTime',
  },
  {
    label: '操作账号',
    field: 'account',
  },
  {
    label: '请求参数',
    field: 'param',
    span: 24,
  },
]);
const [register, { closeModal }] = useModalInner(async (record) => {
  data = record;
  message.value = record.message;
});
const messageData = computed(() => {
  return message.value ? message.value.replaceAll(',', ',\n') : '';
});
</script>
